"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));

var _jsxRuntime = require("react/jsx-runtime");

var _icons = require("@ant-design/icons");

var _antdV = require("antd-v4");

var _react = _interopRequireDefault(require("react"));

require("./ThemeColor.less");

var _excluded = ["color", "check"];

var Tag = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
  var color = _ref.color,
      check = _ref.check,
      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
  return (0, _jsxRuntime.jsx)("div", (0, _objectSpread2.default)((0, _objectSpread2.default)({}, rest), {}, {
    style: {
      backgroundColor: color
    },
    ref: ref,
    children: check ? (0, _jsxRuntime.jsx)(_icons.CheckOutlined, {}) : ''
  }));
});

var ThemeColor = function ThemeColor(_ref2, ref) {
  var value = _ref2.value,
      colorList = _ref2.colorList,
      onChange = _ref2.onChange,
      formatMessage = _ref2.formatMessage;

  if (!colorList || (colorList === null || colorList === void 0 ? void 0 : colorList.length) < 1) {
    return null;
  }

  return (0, _jsxRuntime.jsx)("div", {
    className: "theme-color",
    ref: ref,
    children: (0, _jsxRuntime.jsx)("div", {
      className: "theme-color-content",
      children: colorList === null || colorList === void 0 ? void 0 : colorList.map(function (_ref3) {
        var key = _ref3.key,
            color = _ref3.color;
        if (!key) return;
        return (0, _jsxRuntime.jsx)(_antdV.Tooltip, {
          title: formatMessage({
            id: "app.setting.themecolor.".concat(key)
          }),
          children: (0, _jsxRuntime.jsx)(Tag, {
            className: "theme-color-block",
            color: color,
            check: value === color,
            onClick: function onClick() {
              return onChange && onChange(color);
            }
          })
        }, color);
      })
    })
  });
};

var _default = /*#__PURE__*/_react.default.forwardRef(ThemeColor);

exports.default = _default;